import {
    AddReq,
    CreateCrudOptionsProps,
    CreateCrudOptionsRet,
    DelReq,
    dict,
    EditReq,
    ScopeContext,
    EditableRow,
} from "@fast-crud/fast-crud";
import * as api from "./api";
import { request } from '/@/utils/service';
import { ref } from "vue";
import * as _ from "lodash-es";




export default function ({ crudExpose, context }: CreateCrudOptionsProps): CreateCrudOptionsRet {
    const { crudBinding } = crudExpose;
    const { databaseRef } = context;

    // 注释编号:django-vue3-admin-crud290016:拿到showStatus的值，并对于!showStatus.value.disabled的值这里如果点查看进来的就会拿到false，如果编辑进来的就会true
    const { showStatus } = context;


    const pageRequest = async (query: any) => {
        // 注释编号:django-vue3-admin__crud312516:这里不再需求把databaseRef.value做ID传进去，因为新版本已经直接把父ID封装到query里面了
        return await api.GetList(query);
    };
    const editRequest = async ({ form, row }: EditReq) => {
        if (form.id == null) {
            form.id = row.id;
        }
        return await api.UpdateObj(form);
    };

    // 注释编号:django-vue3-admin__crud585116:重新写一条数据要匹配上移及下移时提交数据
    // const rowEditRequest = async ({ row }: EditReq) => {

    //     return await api.RowUpdateObj(row);
    // };


    const delRequest = async ({ row }: DelReq) => {
        return await api.DelObj(row.id);
    };

    const addRequest = async ({ form }: AddReq) => {

        // 注释编号:django-vue3-admin__crud512516:这里要进行修改，需要返回ID对行，不然第二次点击新增时，会引发两条数据同时进行编辑
        const result = await api.AddObj(form);
        return { id: result.data.id };
    };


    // 注释编号:django-vue3-admin-crud264910:这是是配置一个变量去拿到编辑时，传过来的当前行数据
    let curRowData = ref()


    // 注释编号:django-vue3-admin-crud390616:配合table单选存储的当前行数据
    const curChangeRow = ref()

    const editStatus = ref(false)  // 这里存一个点击编辑按钮的状态，默认为false

    // 注释编号:django-vue3-admin-crud210616:这是单选选中触发的方法
    const onCurrentChange = (row: any) => {
        curChangeRow.value = row

    }

    return {
        crudOptions: {
            request: {
                pageRequest,
                addRequest,
                editRequest,
                // rowEditRequest,
                delRequest
            },
            actionbar: {
                buttons: {
                    add: {
                        show: false
                    },
                    addRow: {
                        show: true
                    },

                    // 注释编号:django-vue3-admin-crud243914:代码开始行
                    // 功能说明:自定义复制一条线行数据
                    copyRow: {
                        text: "复制",//按钮文字
                        type: "warning",  //修改颜色
                        show: !showStatus.value.disabled, // 按查看与编辑的情况下显示或隐藏当前按钮
                        async click() {
                            try {
                                if (curChangeRow.value) {
                                    let copyRowData = JSON.parse(JSON.stringify(curChangeRow.value)); // 深拷贝对象

                                    //如下是为要排除的字段,每张子表可能有所不同，可以使用console.log("111111111111", copyRowData)查看一下
                                    const excludeFields = ['id', 'create_datetime', 'update_datetime', 'dept_belong_id', 'modifier', 'creator', '$editable_id', 'modifier_name', 'creator_name'];
                                    for (let field of excludeFields) {
                                        delete copyRowData[field];
                                    }

                                    //调用新增方法，并且把调整好的copyRowData传进去，如下我们就一定要配置 crudBinding.value?.table?.editable?.addRow方法
                                    crudBinding.value?.table?.editable?.addRow(crudBinding.value.data, copyRowData)

                                    //复制数据，相当于引发编辑状态，所以这里要配置editStatus.value = true来引发相应的dict的URl及label的不同加载
                                    editStatus.value = true

                                    //刷新dict字典
                                    // device_ownership_dit_ref.reloadDict()
                                }
                            } catch (error) {
                                console.error('Error editing row:', error);
                            }
                        },
                    },
                    // 注释编号:django-vue3-admin-crud243914:代码结束行
                }
            },
            search: {
                show: false,
                initialForm: {
                    database: databaseRef
                }
            },
            toolbar: {
                show: false,
                buttons: {
                    refresh: {
                        show: false,
                    }
                }
            },
            table: {
                // 注释编号:django-vue3-admin-crud300516:代码开始行
                // 功能说明:启用table的单选功能及触发的事件
                highlightCurrentRow: true, //启用单选方法，与onCurrentChange单选事件做配套
                onCurrentChange,//启用单独事件，与highlightCurrentRow单选方法做配套
                // 注释编号:django-vue3-admin-crud300516:代码结束行

                editable: {
                    // rowKey:'id',
                    // rowKey:'_index',
                    enabled: true,
                    mode: "row",
                    activeDefault: false,

                    //排它式激活，限制当前子表行编辑只能同时激活一行,当前mode: "row",状态下不生效
                    exclusive: true,
                    exclusiveEffect: "save", // "cancel" | "save";


                    addRow: (data: any[], row: any) => {
                        // (data: any[], row: any) => void
                        //在最后一行插入数据
                        data.push(row)
                    },
                }
            },
            rowHandle: {

                width: 200,   // 注释编号:django-vue3-admin-crud390718:这里要重新定义一个宽度，因为全局定制了170，这里不够使用

                //这个地方才是配置了子表中编辑、取消、保存等按钮的地方
                group: {
                    "editRow": { //行编辑模式

                        // 注释编号:django-vue3-admin-crud170618:代码开始行
                        // 功能说明:这里对edit按钮进行了定制事件，核心代码是直接使用fastcurd的
                        "edit": { //进入编辑
                            click: (context: ScopeContext) => {
                                //如下代码是由fastcrut作者写的，拿到了当前行的标识
                                const { index, row } = context;
                                const editableId = row[crudBinding.value.table?.editable?.rowKey];

                                if (crudBinding.value.table?.editable?.exclusive) {
                                    //排他式激活
                                    const activeRows: EditableRow[] = crudExpose.editable.getActiveRows();
                                    _.forEach(activeRows, (item: EditableRow) => {
                                        if (crudBinding.value.table?.editable?.exclusiveEffect === "save") {
                                            crudExpose.editable.doSaveRow({ row: item.rowData });
                                        } else {
                                            crudExpose.editable.doCancelRow({ row: item.rowData });
                                        }

                                    });
                                }

                                crudExpose.editable.getEditableRow(editableId)?.active();

                                // 注释编号:django-vue3-admin-crud204810:这里是拿到了当前点击编辑的行数据,并且赋值给curRowData，对标注释编号:django-vue3-admin-crud264910
                                curRowData.value = context.row


                                // editStatus.value = false  //配置一个编辑状态,先把他恢复成
                                editStatus.value = true  //配置一个编辑状态


                            },
                        },

                        // 注释编号:django-vue3-admin-crud170618:代码结束行

                        save: {
                            click: async (context: ScopeContext) => {
                                const { index, row } = context;
                                await crudExpose.editable.doSaveRow({ row });    //行数据做保存
                            },
                        },
                    },
                }
            },
            pagination: { show: false, pageSize: 99 },
            columns: {

                // 注释编号:django-vue3-admin-crud532910:代码开始行
                // 功能说明:配置出来fastcrud自带的index索引字段
                _index: {  //把table表索引给显示出来
                    title: "序号",
                    form: { show: false },
                    column: {
                        type: 'index',
                        align: "center",
                        width: "55px",
                        columnSetDisabled: true, //禁止在列设置中选择
                    }
                },
                // 注释编号:django-vue3-admin-crud532910:代码结束行
                database: {
					title: '数据库',
					type: 'number',
                    form: { 
                        value: databaseRef,
                        component: {
                            disabled: true,
                        },
                    },
                    //在页面隐藏起来，不让用户看到父Id字段
                    column: { show: false },
				},
				name: {
					title: '链接名称',
					type: 'input',
					search: { show: true },
					column: {
                        align: "center",
						minWidth: 180,
						sortable: true,
					},
					form: {
						rules: [{ required: true, message: '' }],
						component: {},
					},
				},
                owner: {
					title: '拥有者',
					type: 'input',
					search: { show: false },
					column: {
                        align: "center",
						minWidth: 160,
						sortable: false,
					},
					form: {
						component: {
							placeholder: '',
						},
					},
				},
                link_to: {
					title: '目标数据库',
					type: 'input',
					search: { show: true },
					column: {
                        align: "center",
						minWidth: 160,
						sortable: 'custom',
					},
					form: {
						rules: [{ required: true, message: '' }],
						component: {},
					},
				},
				link_to_ip: {
					title: '目标IP',
					type: 'input',
					search: { show: true },			
					column: {
                        align: "center",
						minWidth: 180,
						sortable: 'custom',
					},
					form: { 
						// helper: '请输入IP地址格式如192.168.1.1',
						rules: [{ pattern:/^(25[0-5]|2[0-4]\d|[0-1]?\d?\d)(\.(25[0-5]|2[0-4]\d|[0-1]?\d?\d)){3}$/, message: '格式如192.168.1.1或255.255.255.0'},
							{ required: true, message: '主机IP必填' }
						],
						component:{},
					},
				},
				link_to_port: {
					title: '目标端口',
					type: 'number',
					search: { show: false },
					column: {
                        align: "center",
						minWidth: 180,
						sortable: false,
					},
					form: {
						component: {
							placeholder: '',
						},
					},
				},
				user_mapping: {
					title: '用户映射',
					type: 'input',
					search: { show: true },
					column: {
                        align: "center",
						minWidth: 160,
						sortable: true,
					},
					form: {
						component: {
							placeholder: '',
						},
					},
				},
            }
        }
    };
}

